<template>
	<view class="title-view just-between">
		<text class="title-text">库位 {{ scope.confluenceLocationCode }}</text>
		<text style="margin-left: 15rpx;font-size: 30rpx;color: orange; font-weight: 600"
			v-if="formatDuringText && scope.reviewTaskStatus != '2'">{{
			(isGreaterThanCurTime ? '复核剩余 ' : '复核超时 ') + formatDuringText }}</text>
	</view>
	<view class="flex just-between align-center" style="width: 100%;margin-bottom: 8rpx;">
		<eui-status type="error" title="整单缺货" v-if="scope.pickStatus == '0'" />
		<eui-status type="success" title="拣货完成" v-if="scope.pickStatus == '1'" />
		<eui-status type="error" title="部分缺货" v-if="scope.pickStatus == '10'" />
		<view style="margin-left: 20rpx;">{{ scope.thirdOrderNo }}</view>
		<view class="flex align-center">
			<view class="flex">
				<view class="chnlbox" :style="{ backgroundColor: color, color: color ? '#fff' : '#000' }"
					v-if="chnlType">
					{{ chnlType.substring(0, 1) }}
				</view>
				<view class="chnltype" :style="{ backgroundColor: color, color: color ? '#fff' : '#000' }" v-else>
					{{ chnlType }}
				</view>
				<view v-if="!!scope.thirdOrderIndex" style="font-size: 42rpx;font-weight: bold;">
					<text>#</text>{{ scope.thirdOrderIndex }}
				</view>
			</view>
		</view>
	</view>
	<view v-if="scope.orderRemark"
		style="background-color: #dff3ff;line-height: 35rpx;padding: 18rpx 24rpx;font-size: 32rpx;margin-bottom: 13rpx;border-radius: 0px 0px 16rpx 16rpx;">
		<text>备注：</text>{{ scope.orderRemark }}
	</view>
	<view class="" style="font-size: 28rpx;flex: 1;">
		订单金额<text class="bold co-red"> {{ formatPrice(scope.orderAmount) }}</text> 商品 <text class="bold">{{
			scope.goodsNum }}件</text> 重<text class="bold">{{ scope.goodsWeight }}kg</text>
	</view>
	<!-- <view class="flex just-between">
		<view class="" style="font-weight: bold;font-size: 32rpx;flex: 1;">
			订单金额<text>{{ scope.orderAmount }}</text>
			商品 {{ scope.goodsNum }}件 重{{ scope.goodsWeight }}kg
		</view>
		<view class="flex just-between">
			<view style="width:70rpx;height: 70rpx;border-radius: 70rpx;background:#EDEDED;"
			class="flex align-center just-center" @click.stop="showImage = !showImage"
			v-if="!showImage">
			<image src="../../../../static/img/bcmIcon/list.png" style="height: 42rpx;width: 42rpx;"></image>
			</view>
			<view style="width:70rpx;height: 70rpx;border-radius: 70rpx;background:#EDEDED;"
			class="flex align-center just-center" @click.stop="showImage = !showImage"
			v-else>
			<image src="../../../../static/img/bcmIcon/list_show.png" style="height: 42rpx;width: 42rpx;"></image>
			</view>
			<view class="flex align-center just-right" style="color:#4C4C4C;font-size: 32rpx;margin-left: 30rpx;"
				@click.stop="setOrderGoodsOpen">
				<view>订单详情</view>
				<uni-icons :type="goodsOpen ? 'up' : 'down'" size="15"
					style="color: #4C4C4C !important;margin-top: 6rpx;"></uni-icons>
			</view>
		</view>
	</view>
	<view class="" v-if="goodsOpen">
		<goods-list :goods-list="scope.bcmReviewTaskDetailList" :showImage="showImage"></goods-list>
	</view> -->
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue';
import { computed, defineProps } from 'vue';
import { formatPrice } from '../../../../hooks/bcmUseUntils';
import { greaterThanCurTime, getDiffTime } from '../../../../hooks/useDatetimeUtil'

const props = defineProps<{
	scope?: any;
	currentTime?: any;
	chnlTypeList?: any[];
}>()

const formatDuringText = computed(() => {
	if (!!props.scope.expectReviewTime) {
		return getDiffTime(new Date(props.scope.expectReviewTime.replace(/-/g, "/")));
	}
})

const isGreaterThanCurTime = computed(() => {
	if (!!props.scope.expectReviewTime) {
		return greaterThanCurTime(new Date(props.scope.expectReviewTime.replace(/-/g, "/")));
	}
})

const chnlType = computed(() => {
	return props.chnlTypeList?.find(v => v.value == props.scope.chnlType)?.text || props.scope.chnlType
})

const color = computed(() => {
	return props.chnlTypeList?.find(v => v.value == props.scope.chnlType)?.color || '#000'
})

</script>
<style lang="scss" scoped>
@import "../../common/common.css";

.popup-content {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 0;
	background-color: #fff;

	.popup-title {
		display: flex;
		align-items: center;
		box-sizing: border-box;
		width: 100%;
		height: 100rpx;
		padding-right: 36rpx;
		padding-left: 30rpx;
		font-size: 33rpx;
		line-height: 100rpx;
		border-bottom: 1rpx solid #f1f1f1;
	}
}

.bottom-1 {
	display: flex;
	justify-content: center;
	flex: 0 0 auto;
	height: 70rpx;
}


.title-view {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	height: 46rpx;
	margin-bottom: 24rpx;
}

.title-text {
	margin-top: 0;
	font-size: 32rpx;
	font-style: normal;
	font-weight: 600;

	//   color: $uni-text-color-primary;
	line-height: 45rpx;
	text-align: left;
}
</style>